document.getElementById('banner-title').innerText = config.title
document.getElementById('banner-desc').innerText = config.titleDesc

const headTitleDom = document.querySelector('head title')
if (config.title) {
    headTitleDom.innerText = config.title
}

// 基础信息容器
const baseContainer = document.getElementById('base-container');
const infoContainer = document.getElementById('info-container');
// 侧边栏容器
const sideContainer = document.getElementById('side-container');

// 当前侧边栏
let currentSideIndex = 0
// 侧边栏项集合
const sideItemList = []

// vue名称列表
const vueNames = Object.keys(vueMap)
// 当前vue信息
let currentVueInfo = vueMap[vueNames[currentSideIndex]]

function buildExTitle(title) {
    const titleContainerDom = document.createElement('div')
    titleContainerDom.className = 'ex-title'
    const titleTextDom = document.createElement('div')
    titleTextDom.className = 'ex-title-text'
    titleTextDom.innerText = title
    titleContainerDom.appendChild(titleTextDom)
    return titleContainerDom
}

function buildTag(text, type) {
    const spanDom = document.createElement('span')
    spanDom.className = `ex-tag tag-${type || 'primary'}`
    spanDom.innerText = text
    return spanDom
}

// 构建基础内容
function buildBaseInfo() {
    const titleContainerDom = buildExTitle(currentVueInfo.name)

    if (currentVueInfo.setup) {
        const setupTagDom = buildTag('setup', 'success')
        setupTagDom.style.marginLeft = '10px'
        titleContainerDom.appendChild(setupTagDom)
    }

    if (currentVueInfo.lang && currentVueInfo.lang === 'ts') {
        const setupTagDom = buildTag(currentVueInfo.lang)
        setupTagDom.style.marginLeft = '10px'
        titleContainerDom.appendChild(setupTagDom)
    }

    baseContainer.innerHTML = [
        titleContainerDom.outerHTML,
        '<div class="vue-info vue-info-path" style="display: block">路径：' + currentVueInfo.path + '</div>',
        '<span class="vue-info">文件名称：' + currentVueInfo.filename + '</span>',
        '<span class="vue-info">大小：' + (currentVueInfo.fileStats.size / 1024).toFixed(2) + 'KB</span>',
        '<span class="vue-info">创建时间：' + formatDate(new Date(currentVueInfo.fileStats.birthtime)) + '</span>',
        '<span class="vue-info">修改时间：' + formatDate(new Date(currentVueInfo.fileStats.mtime)) + '</span>'
    ].join('\n')
}

function buildInfo() {
    infoContainer.innerHTML = [
        '<div class="vue-desc">' + currentVueInfo.info.desc + '</div>'
    ].join('\n')
}

buildBaseInfo()
buildInfo()
